import QtQuick 1.1

Rectangle {
    id: root
    width: 70; height: 70
    color: "transparent"

    property int numero : 0

    signal click(variant item, int numero)
    signal moveCompleted(int x, int y)

    function mover(x, y) {
        if (!anim.running) {
            anim.toX = x;
            anim.toY = y;
            anim.restart();
        }
    }

    function esconder(opacidade) {
        //esconderMostrarAnim.toOpacity = opacidade;
        //esconderMostrarAnim.restart();
        root.opacity = opacidade;
    }

    function mostrar() {
        //esconderMostrarAnim.toOpacity = 1;
        //esconderMostrarAnim.restart();
        root.opacity = 1;
    }

    function naoPode() {
        piscarNao.restart();
    }

    Image {
        id: backGround
        source: "qrc:///butaum"
        width: parent.width; height: parent.height
        fillMode: Image.PreserveAspectFit
        visible: root.numero !== 0

        Text {
            anchors.centerIn: parent
            text: (root.numero !== 0 ? root.numero : "")
            color: platformStyle.colorNormalDark
            font { pixelSize: 25;  }
        }
    }    

    MouseArea {
        anchors.fill: parent
        onClicked: {
            if (root.numero != 0)
                root.click(root, root.numero);
        }
    }

    SequentialAnimation {
        id: anim
        running: false
        property int toX : 0
        property int toY : 0

        ParallelAnimation {
            NumberAnimation {
                target: root; property: "x"; to: anim.toX; duration: 150
            }
            NumberAnimation {
                target: root; property: "y"; to: anim.toY; duration: 150
            }
        }
        onCompleted: root.moveCompleted(root.x, root.y);
    }

    SequentialAnimation {
        id: esconderMostrarAnim
        running: false

        property double toOpacity : 0

        NumberAnimation {
            target: root; property: "opacity"; to: esconderMostrarAnim.toOpacity; duration: 20;
        }
    }

    SequentialAnimation {
        id: piscarNao

        PropertyAction { target: backGround; property: "opacity"; value: 0.01 }
        PropertyAction { target: naoImg; property: "visible"; value: true}
        PauseAnimation { duration: 300 }
        PropertyAction { target: naoImg; property: "visible"; value: false}
        PauseAnimation { duration: 50 }
        PropertyAction { target: naoImg; property: "visible"; value: true}
        PauseAnimation { duration: 50 }
        PropertyAction { target: naoImg; property: "visible"; value: false}
        PauseAnimation { duration: 50 }
        PropertyAction { target: naoImg; property: "visible"; value: true}
        PauseAnimation { duration: 50 }
        PropertyAction { target: naoImg; property: "visible"; value: false}
        PropertyAction { target: backGround; property: "opacity"; value: 1 }
    }

    Image {
        id: naoImg
        width: parent.width; height: parent.height
        source: "qrc:///no"
        visible: false
        anchors.centerIn: parent
    }
}
